import React, { useEffect, useState } from 'react';
import { Table, Radio } from 'antd';
import type { TableProps } from 'antd';
import UploadFile from '../../../Compon/UploadFile';
import OutFile from '../../../Compon/file/Gooutfile.jsx';

type ColumnsType<T extends object> = TableProps<T>['columns'];
type TablePagination<T extends object> = NonNullable<
  Exclude<TableProps<T>['pagination'], boolean>
>;
type TablePaginationPosition<T extends object> = NonNullable<
  TablePagination<T>['position']
>[number];
export default function Tbale(props) {
  const rowSelection: TableProps<T>['rowSelection'] = {
    onChange: (selectedRowKeys: React.Key[], selectedRows) => {
      console.log(
        `selectedRowKeys: ${selectedRowKeys}`,
        'selectedRows: ',
        selectedRows,
      );
    },
  };
  const [selectionType, setSelectionType] = useState<'checkbox' | 'radio'>(
    'checkbox',
  );
  const [top, setTop] = useState<TablePaginationPosition<DataType>>('topLeft');
  const [bottom, setBottom] =
    useState<TablePaginationPosition<DataType>>('bottomRight');


  return (
    <div>
      <Table
        loading={props.data ? false : true}
        rowSelection={{ type: selectionType, ...rowSelection }}
        columns={props.colums}
        dataSource={props.data}
        pagination={{
          position: [bottom],
          defaultPageSize: props.pageSize ? props.pageSize :10 ,
          defaultCurrent: 1, // defaultPageSize: 10,
          total: props.data ? props.data.length : 0,
          showTotal: (total) => `共 ${total} 个数据`,
          showSizeChanger: true,
          pageSizeOptions: ['2', '10', '20', '50', '100'],
        }}
      />
    </div>
  );
}
